import * as echarts from '../../ec-canvas/echarts'

var app = getApp();


Page({
  data: {
    showDevices: false,
    selectedDevice: {},
    totalDevices: {},
    showLoading: false,

    tenhouses: [],
    lazyEc: {
      lazyLoad: true
    },
    dataTime: [],
    dataCount: []
  },
  onLoad(options) {
    //获取到组件
    let that = this;

    this.setData({
      selectedDevice: app.globalData.selectedDevice,
      totalDevices: app.globalData.totalDevices
    });

    this.lazyComponent = this.selectComponent('#lazy-mychart-dom');
    this.getHenhouses();
    this.init(0);
  },

  getHenhouses() {
    var currentPage = this;
    wx.request({
      url: app.globalData.baseUrl + '/api/services/app/OneNetApiService/GetDeviceProperties',
      data: { deviceId: this.data.selectedDevice.deviceId },
      header: {
        'content-type': 'application/json', // 默认值
        'Authorization': 'Bearer ' + app.globalData.token
      },
      success(res) {
        currentPage.setData({
          tenhouses: res.data.result
        });
      },
      fail(res) {
        console.log(res);
      },
      complete(res) {
        currentPage.setData({
          showLoading: false
        });
      }
    });
  },

  init(index) { //手动初始化
    this.lazyComponent.init((canvas, width, height, dpr) => {
      let chart = echarts.init(canvas, null, {
        width: width,
        height: height,
        devicePixelRation: dpr
      });
      var currentPage = this;
      wx.request({
        url: app.globalData.baseUrl + '/api/services/app/OneNetApiService/GetOneWeekDeviceTotalData',
        data: {
          deviceId: this.data.selectedDevice.deviceId,
          deviceTypeId: this.data.selectedDevice.deviceTypeId,
          index: index
        },
        header: {
          'content-type': 'application/json', // 默认值
          'Authorization': 'Bearer ' + app.globalData.token
        },
        success(res) {
          var timeColumns = [], dataColumns = [];
          var source = res.data.result;
          source.forEach(item => {
            timeColumns.push(item.at);
            dataColumns.push(item.value);
          });
          let option = getOption(timeColumns, dataColumns, currentPage.data.selectedDevice.displayName)  // echarts的配置信息
          chart.setOption(option)
          currentPage.chart = chart //将图表实例绑定到this上，方便其他函数访问
          return chart
        },
        fail(res) {
          console.log(res);
        },
        complete(res) {
          currentPage.setData({
            showLoading: false
          });
        }
      });
    });
  },
  changeHenhouse(event) {
    this.init(event.detail.index)
  },
  showDeviceList() {
    this.setData({ showDevices: true });
  },
  closeDeviceList() {
    this.setData({ showDevices: false });
  },
  changeSelectedDevice(e) {
    var selected = e.currentTarget.dataset["item"];
    this.setData({
      selectedDevice: selected,
      showDevices: false
    });
    this.init(0)
  },
})
//mark:getOption
function getOption(dataTime, dataCount, title) {
  return {
    title: {
      text: title,
      left: 'center'
    },
    color: ["#37A2DA"],
    grid: {
      containLabel: true
    },
    tooltip: {
      trigger: 'axis',
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: dataTime
    },
    yAxis: {
      type: 'value',
      minInterval: 100,
      scale: true,//自动Y轴坐标居中
      boundaryGap: ["0.1", "0.1"],//上下留白10%
      splitLine: {
        lineStyle: {
          type: 'dashed'
        }
      }
    },
    series: [
      {
        name: '产蛋量',
        type: 'line',
        showSymbol: true,
        smooth: true,
        color: ["#00cc00"],
        data: dataCount
      },
    ]
  }
}